import React, { memo } from 'react';

/**左侧 */
//轮播图
import TopBanner from "./child/top-banner";
//热门推荐
import HotRecommend from "./child/hot-recommend";
//新碟上架
import NewAlbum from "./child/new-album";
//榜单
import RcmdRanking from "./child/rcmd-ranking";

/**右侧 */
//用户登录
import UserLogin from "./child/user-login";
//入驻歌手
import SettleSinger from "./child/settle-singer";
//热门主播
import HotAnchor from "./child/hot-anchor";

import { RecommendWrapper, Content, RecommendLeft, RecommendRight } from "./style";

const DisRecommend = memo(() => {
  return (
    <RecommendWrapper>
      <TopBanner />

      <Content className="wrap-v2">
        <RecommendLeft>
          <HotRecommend />
          <NewAlbum />
          <RcmdRanking />
        </RecommendLeft>

        <RecommendRight>
          <UserLogin />
          <SettleSinger />
          <HotAnchor />
        </RecommendRight>
      </Content>
    </RecommendWrapper>
  )
});


export default DisRecommend;


// const DisRecommend = memo((props) => {
//   const { getBanners, topBanners } = props;

//   useEffect(() => {
//     getBanners()
//   }, [getBanners])
  

//   return (
//     <div>
//       <h2>DisRecommend:{topBanners.length}</h2>
//     </div>
//   )
// });

// //3.取出数据
// const mapStateToProps = (state) => ({
//   topBanners: state.recommend.topBanners
// });
// const mapDispatchToProps = (dispatch) => ({
//   getBanners: () => {
//     dispatch(getTopBannersAction())
//   }
// })

// export default connect(mapStateToProps, mapDispatchToProps)(DisRecommend);